<template>
  <div class="app-container">


    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
      <el-form-item label="规则名称" prop="ruleTitle">
        <el-input v-model="form.ruleTitle" placeholder="请输入规则名称" disabled/>
      </el-form-item>


      <el-form-item label="预警方式" prop="warningNoticeType">
        <el-checkbox-group v-model="form.warningNoticeType">
          <el-checkbox
            v-for="dict in warningNoticeTypeOptions"
            :key="dict.dictValue"
            :label="dict.dictValue"
          >{{dict.dictLabel}}
          </el-checkbox>
        </el-checkbox-group>
      </el-form-item>


    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">确 定</el-button>
    </div>

  </div>
</template>

<script>
  import { updateRule} from "@/api/system/rule";
  import Editor from '@/components/Editor';

  export default {
    name: "Rule",
    components: {
      Editor,
    },
    data() {
      return {
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 表单参数
        form: {
          id:0,
          ruleTitle:'',
          receiverList: [],
          warningNoticeType: []
        },
        // 表单校验
        rules: {
          ruleTitle: [
            {required: true, message: "规则名称不能为空", trigger: "blur"}
          ],
          // receiverList: [
          //   {required: true, message: "请选择预警接收人", trigger: "blur"}
          // ],
          warningNoticeType: [
            {required: true, message: "请选择预警方式", trigger: "blur"}
          ],

        },
        receiverList: [],
        warningNoticeTypeOptions: [],
        //传递过来的参数
        // receivers: [],
        warningTypes:[]
      };
    },
    created() {
      this.form.id=this.$route.query.id
      this.form.ruleTitle=this.$route.query.ruleTitle

      this.warningTypes=this.$route.query.warningTypes

      this.warningTypes.forEach(item=>{
        this.form.warningNoticeType.push(item.warningNoticeType)
      })
      this.getDicts("warning_notice_type").then(response => {
        this.warningNoticeTypeOptions = response.data;
      });

    },
    methods: {
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
              updateRule(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open = false;
              });

          }
        });
      },

    }
  };
</script>

